﻿@{
    ViewBag.Title = "MapsList";
}

<div class="center" id="divMap">
    <div id="Breadcrumb" class="Breadcrumb">
        <ul>
            <li class="first">
                <a href='javascript:;' onclick="javascript:loadAction('Index2','Main')">Trang chủ
                </a>
            </li>
            <li>
                <a href='javascript:;' onclick="javascript:loadAction('personal','Account')">Tài khoản của tôi
                </a>
            </li>
            <li>
                <span>Bản đồ</span>
            </li>
        </ul>
    </div>
    <div class="Account-Module DefaultModule">
        <div class="Block DefaultModule">
            <div id="CartHeader" class="Block Moveable Panel">
                <h2>Bản đồ
                </h2>
            </div>
            <script type="text/javascript">
                var map;
                var marker;
            </script>
            <div id="CartContainer" class="Block Moveable Panel">
                <div class="BlockContent">
                    @if (Model != null)
                    {
                        <dl style="margin-top: 10px; margin-bottom: 20px;">
                            <dt>
                                <select style="width: 150px;" id="mapSelect" onchange="mapNameChange(map,marker)">
                                    @{int nameCount = 0;}
                                    @foreach (var m in Model)
                                    {
                                        var nameID = "addID" + nameCount++;                                        
                                        <option value="@nameID">@m.name</option>                                
                                    }                                    
                                </select>
                                <input type="hidden" value="@nameCount" id="maxLoc"/>
                                <input type="hidden" value="" id="LocID"/>
                            </dt>
                            <dd style="padding-top: 0px; margin-left: 170px;">
                                @{int addressCount = 0;}
                                @foreach (var m in Model)
                                {
                                    var IDID = "IDID" + addressCount;
                                    var addID = "addID" + addressCount;
                                    var latID = "latID" + addressCount;
                                    var lngID = "lngID" + addressCount++;
                                    <input value="@m.ID" id="@IDID" type="hidden"/>
                                    <input value="@m.address" id="@addID" type="hidden"/>
                                    <input value="@m.lat" id="@latID" type="hidden"/>
                                    <input value="@m.lng" id="@lngID" type="hidden"/>
                                }
                                <input type="text" value="" style="width: 280px" id="address" />
                                <a href="javascript:;" onclick="javascript:updateLocation()" class="myBtn1">Cập nhật</a>
                                <a href="javascript:;" onclick="javascript:DeleteLocation()" class="myBtn1">Xóa</a>
                            </dd>
                        </dl>
                    }
                    <div id="map-canvas" style="width: 570px; height: 460px;"></div>
                </div>
            </div>

            <div class="defaultContent LoginForm-content CreateAccountContainer">
                <div class="FormContainer HorizontalFormContainer NarrowFormContainer">
                    <dl>
                        <dt><span class="required">*</span>Tên cơ sở:
                        </dt>
                        <dd>
                            <input name="mapName" type="text" value=""
                                id="mapName" class="NormalTextBox" style="width: 300px;">
                        </dd>
                        <dt>
                            <span class="required">*</span> Địa chỉ:
                        </dt>
                        <dd>
                            <input name="mapAddress" type="text" value=""
                                id="mapAddress" class="NormalTextBox" style="width: 300px;">
                        </dd>
                        <dt>
                            <span class="required">*</span> Tọa độ:
                        </dt>
                        <dd>
                            <input name="mapPosition" type="text" value="" readonly="true"
                                id="mapPosition" class="NormalTextBox" style="width: 300px;">
                        </dd>
                        <dt>&nbsp;</dt>
                        <dd>                            
                            <a href="javascript:;" onclick="javascript:saveLocation()" class="myBtn1">Thêm địa điểm mới</a>
                        </dd>
                    </dl>
                </div>

                <p>
                </p>
            </div>

        </div>
    </div>
</div>
<script type="text/javascript">
    loadScript(initAdminGmap);
</script>
